<template>
  <div class="player">
    <div id="player"></div>
  </div>
</template>

<script>
    export default {
        name: "Player",
        data() {
            return {}
        },
        methods: {
            // 检查当前访问者是否登录
            check_user_login() {
                let token = sessionStorage.user_token || localStorage.user_token;
                if (!token) {
                    this.$confirm('您尚未登录，请先登录官网！', '路飞学城官网温馨提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.$router.push('/login/');
                    });
                    return false;
                }
                return token
            },
        },

        // 生命周期钩子函数
        mounted() {
            let jwt_token = this.check_user_login();

            let user_name = localStorage.user_name || sessionStorage.user_name;

            // 1. 到数据库中查询用户购买的课程，是否有当前章节
            // 2. 到数据库中查询当前用户购买的课程是否在有效期内
            // 3. 播放页面显示课程章节和课时的播放列表
            // 4. 通过vid播放不同的课时视频
            // 以上4个功能自行完成
            let vid = "8979e7991539b5d41767d5360c5d638c_8"; // this.$route.query.vid;
            let self = this;
            var player = polyvPlayer({
                wrap: '#player',
                width: document.documentElement.clientWidth - 260, // 页面宽度
                height: document.documentElement.clientHeight, // 页面高度
                forceH5: true,  //支持h5标准
                vid: vid,
                code: user_name, // 一般是用户昵称
                // 视频加密播放的配置
                playsafe: function (vid, next) { // 向后端发送请求获取加密的token
                    self.$axios.get(`${self.$settings.Host}/course/player/`, {
                        params: {
                            vid: vid,
                        },
                        headers: {
                            "Authorization": "jwt " + jwt_token,
                        }
                    }).then(function (response) {
                        // 获取播放视频的token令牌
                        console.log(response);

                        next(response.data);  //token字符串
                    })
                }
            });
        },

        computed: {},

    }
</script>

<style scoped>
</style>
